$(function(){
		/*瀑布流开始*/
		var container = $('#waterfull ul');
		/*判断瀑布流最大布局宽度，最大为1280*/
		function tores(){
			var tmpWid=$(window).width();
			if(tmpWid>1160){
				tmpWid=1160;
			}else{
				var column=Math.floor(tmpWid/270);
				tmpWid=column*270;
			}
			$('#waterfull').width(tmpWid);
		}
		tores();
		$(window).resize(function(){
			tores();
		});
		container.imagesLoaded(function(){
		  container.masonry({
		  	columnWidth:290,
		    itemSelector : '.item',
		    isFitWidth: true,//是否根据浏览器窗口大小自动适应默认false
		    isAnimated: true,//是否采用jquery动画进行重拍版
		    isRTL:false,//设置布局的排列方式，即：定位砖块时，是从左向右排列还是从右向左排列。默认值为false，即从左向右
		    isResizable: true,//是否自动布局默认true
		    animationOptions: {
				duration: 800,
				easing: 'easeInOutBack',//如果你引用了jQeasing这里就可以添加对应的动态动画效果，如果没引用删除这行，默认是匀速变化
				queue: false//是否队列，从一点填充瀑布流
			}
		  });
		});
		/*模拟从后台获取到的数据*/
		//var sqlJson=[{'title':'瀑布流其实就是几个函数的事！','intro':'爆料，苏亚雷斯又咬人啦，C罗哪有内马尔帅，梅西今年要不夺冠，你就去泰国吧，老子买了阿根廷赢得彩票，输了就去不成了。','src':'images/one.jpg','writer':'jq22','date':'2小时前','looked':321},{'title':'瀑布流其实就是几个函数的事！','intro':'爆料了，苏亚雷斯又咬人啦，C罗哪有内马尔帅，梅西今年要不夺冠，你就去泰国吧，老子买了阿根廷赢得彩票，输了就去不成了。','src':'images/demo2.jpg','writer':'jq22','date':'2小时前','looked':321},{'title':'瀑布流其实就是几个函数的事！','intro':'爆料了，苏亚雷斯又咬人啦，C罗哪有内马尔帅，梅西今年要不夺冠，你就去泰国吧，老子买了阿根廷赢得彩票，输了就去不成了。','src':'images/p1.jpg','writer':'jq22','date':'2小时前','looked':321},{'title':'瀑布流其实就是几个函数的事！','intro':'爆料了，苏亚雷斯又咬人啦，C罗哪有内马尔帅，梅西今年要不夺冠，你就去泰国吧，老子买了阿根廷赢得彩票，输了就去不成了。','src':'images/p1.jpg','writer':'jq22','date':'2小时前','looked':321}];
		/*本应该通过ajax从后台请求过来类似sqljson的数据然后，便利，进行填充，这里我们用sqlJson来模拟一下数据*/
		//var sqlJsonlength=sqlJson.length;
		$(".questionAnswer_more").click(function () {
			var p_ = $("#comment_page").val();
			if(p_ > 0)
			{
				//请求数据
				$.ajax({
					url:"/hotel/getComment.html",
					type:'POST',
					dataType:'JSON',
					async: false,
					data:{
						"hotel_id":hotel_id,
						"p":p_
					},
					success:function(result){
						if(result.code == "0"){						
							loadComment(result.content);
							if(result.page == 0){
								$('.questionAnswer_more').html("已经是最后一页！");
							}
							$('#comment_page').val(result.page);
						}else{
							layer.msg("请求出错！");
						}
					},
					error:function(result){
						layer.msg(result.code);
					}
				});
			}
			/*for(var i=0;i<sqlJsonlength;i++){
				html+="<li class='item'> <div class='fixheight clearfix'> <img src='images/images39.png' alt='' title='' class='fl'/><div class='fl margin_left10'><p class='font_size14 font_blod padding_top5 lineheight24'>wyy18627567841</p><p class='member_grade5 fontfamily_song'><i style='margin-left: 0;'></i><span class='font_size12'>白金会员</span></p></div></div><div class='padding_lar20 padding_top10'>";
				html+="<p class='color_666 lineheight20'>因为没有房间了，所以免费给我们升级到主楼六百多价位的房间，大酒店的各项服务都很到位，工作人员都很负责。</p> ";
				html+="<p class='waterfall_imgbox clearfix'> <img src='images/waterfall1.jpg' alt='' title=''/> <img src='images/waterfall2.jpg' alt='' title=''/> <img src='images/waterfall3.jpg' alt='' title=''/> <img src='images/waterfall4.jpg' alt='' title=''/> </p> ";
				html+="<div class='waterfall_hotelcomment'> <p class='color_999'><span class='color_f08519'>酒店回复：</span>尊敬的朋友您好，您的满意是对我们最大的追求，您住的舒心了，我们也就放心了，有您的支持，让我们也就放心了您的满意是对我们最大的追求，您住的舒心了，我们也就放心了，有您的支持，让我们也就放心了</p> </div>";
				html+="<div class='clearfix color_999 font_size12 bottom_box'> <div class='mystar_show fl'><p tip='3.5'></p></div> <p class='fl'>5分</p> <p class='fr'>2017-08-21 09:34</p> </div> </div> </li>";
			}*/			
		})
		
		function loadComment(content) {
			var html="";
			for(var i=0;i<content.length;i++){
				var face = (content[i]['user_info']['face']) ? content[i]['user_info']['face'] : '/attachs/avatar.jpg';
				html+="<li class='item'> <div class='fixheight clearfix'> <img src='"+face+"' alt='' title='' class='fl'/><div class='fl margin_left10'><p class='font_size14 font_blod padding_top5 lineheight24'>"+content[i]['user_info']['nickname']+"</p><p class='member_grade5 fontfamily_song'><i style='margin-left: 0; background:url("+content[i]['user_info']['rank_icon']+")'></i><span class='font_size12'>"+content[i]['user_info']['rank_name']+"</span></p></div></div><div class='padding_lar20 padding_top10'>";
				html+="<p class='color_666 lineheight20'>"+content[i]['content']+"</p> ";
				if(content[i]['photos']){
					html+="<p class='waterfall_imgbox clearfix'>";
					var photos = content[i]['photos'];
					for(var j=0;j<photos.length;j++){
						html+="<img src='"+photos[j]+"'/>";
					}					
					html+="</p> ";
				}
				if(content[i]['reply']){
					html+="<div class='waterfall_hotelcomment'> <p class='color_999'><span class='color_f08519'>酒店回复：</span>"+content[i]['reply']+"</p> </div>";
				}
				html+="<div class='clearfix color_999 font_size12 bottom_box'> <div class='mystar_show fl'><p tip='"+content[i]['score']+"'></p></div> <p class='fl'>"+content[i]['score']+"分</p> <p class='fr'>"+content[i]['create_time']+"</p> </div> </div> </li>";
			}
			
			var time=setTimeout(function(){
				$(html).find('img').each(function(index){
					loadImage($(this).attr('src'));
				})
				var $newElems = $(html).css({ opacity: 0}).appendTo(container);
				$newElems.imagesLoaded(function(){
					$newElems.animate({ opacity: 1},800);
					container.masonry( 'appended', $newElems,true);
					clearTimeout(time);
		        });
			},800)
		};
		
		function loadImage(url) {
		     var img = new Image(); 
		     //创建一个Image对象，实现图片的预下载
		      img.src = url;
		      if (img.complete) {
		         return img.src;
		      }
		      img.onload = function () {
		       	return img.src;
		      };
		 };
})